<!DOCTYPE composition PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd" >
<ui:composition xmlns="http://www.w3.org/1999/xhtml"
	xmlns:ui="http://java.sun.com/jsf/facelets"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:s="http://jboss.com/products/seam/taglib"
	xmlns:a="http://richfaces.org/a4j"
	xmlns:rich="http://richfaces.org/rich"
	template="/templates/mainTemplate.xhtml" >
  
	<ui:define name="content">
	
		<f:view>
			<h:form id="registroRestaurante" enctype="multipart/form-data">
				<div align="center">
					<rich:panel styleClass="bloquecentral" >	
							<div class="registerRestaurant bloques">
							<div align="center"><h:graphicImage
								value="/layout/img/registro.jpg"></h:graphicImage></div>
			
							<div align="right" style="padding-right: 210px;"><h:panelGrid
								columns="3" rowClasses="registerRow" cellspacing="10" columnClasses="registerColumn">
			
								<h:outputLabel value="Nombre" for="regRestaurantName"></h:outputLabel>
								<h:inputText id="regRestaurantName" style=" width : 130px;"
									styleClass="inputText" value="#{restaurant.nombre}">
									<s:validate />
								</h:inputText><h:message for="regRestaurantName"></h:message>
			
								<h:outputLabel value="Categoria" for="regCategory"></h:outputLabel>
								<h:selectOneMenu value="#{restaurant.categoria}" id="regCategory" style=" width : 130px;" styleClass="inputText">
									<s:selectItems var="categoria" value="#{categorias}" label="#{categoria.nombre}"/>
									<s:convertEntity />
								</h:selectOneMenu>
								<h:message for="regCategory"></h:message>
			
			
								<h:outputLabel value="#{messages.phone}" for="regPhone"></h:outputLabel>
								<h:inputText id="regPhone" style=" width : 130px;"
									styleClass="inputText" value="#{restaurant.telefono}"></h:inputText>
								<h:message for="regPhone"></h:message>
			
			
								<h:outputLabel value="#{messages.email}" for="regEmail"></h:outputLabel>
								<h:inputText id="regEmail" style=" width : 163px;"
									styleClass="inputText" value="#{restaurant.email}"></h:inputText>
								<h:message for="regEmail"></h:message>
			
			
								
								<h:outputLabel value="#{messages.province}" for="regProvincias"></h:outputLabel>
								<h:selectOneMenu id="regProvincias" styleClass="inputText"
									value="#{registerRestaurant.provinciaRestaurante}" immediate="true" style=" width : 168px;">
									<a:support event="onchange" reRender="regMunicipiosPanel" />
									<s:selectItems value="#{provincias}" var="provinciaRestaurante"
										label="#{provinciaRestaurante.nombre}"
										noSelectionLabel="Seleccione provincia" />
									<s:convertEntity />
								</h:selectOneMenu>
								<h:message for="regProvincias"></h:message>
			
								<h:outputLabel value="#{messages.city}" for="regMunicipio"></h:outputLabel>
								<a:outputPanel id="regMunicipiosPanel" ajaxRendered="true">
									<h:selectOneMenu id="regMunicipio" styleClass="inputText"
										value="#{registerRestaurant.municipioRestaurante}" style=" width : 300px;">
										<s:selectItems value="#{registerRestaurant.findMunicipios()}"
											var="municipioRestaurante" label="#{municipioRestaurante.nombre}"
											noSelectionLabel="Seleccione Municipio" />
										<s:convertEntity /> 
									</h:selectOneMenu>
								</a:outputPanel>
								<h:message for="regMunicipio"></h:message>
			
							</h:panelGrid></div>
							<br />
							<br />
							
							<hr/>
							
							<br />
							<br />
							<div align="center"><h:panelGrid
								columns="3" rowClasses="registerRow">
									<h:selectBooleanCheckbox value="#{restaurant.permiteFumadores}" id="regSmoking">
										<a:support event="onchange" reRender="zonaMesas" />
									</h:selectBooleanCheckbox>
									<h:outputLabel value="Zona de fumadores" for="regSmoking"></h:outputLabel>
									<h:message for="regSmoking"></h:message>
								</h:panelGrid>
							</div>
						<br />
						<br />
						
						<a:outputPanel id="zonaMesas">
							<rich:tabPanel switchType="client">
								
								<rich:tab label="Zona para no fumadores" labelWidth="380px"> 
									<br />
									<br />
									<div align="center"  id="noFumadores">
										<h:panelGrid columns="2">
											<h:graphicImage value="/layout/img/iconoMesa.jpg"/>
											<h:panelGrid columns="2">				
												<h:panelGrid columns="1">
													<h:outputText value="Num. Comensales" />
													<h:outputText value="Codigo"/>
												</h:panelGrid>
												<h:panelGrid columns="1">
													<h:inputText id="comensales" value="#{table.capacidad}" style=" width : 41px;"/> 
													<h:inputText id="codigo" value="#{table.codigo}" style=" width : 41px;"/> 
												</h:panelGrid>
											</h:panelGrid> 
										</h:panelGrid>				
										<center>									
											<a:commandButton action="#{registerRestaurant.addTable}" value="Aadir mesa" reRender="noSmokingList" style=" width : 100px; height : 25px;"/>
										</center>
										<br/><br/>
										<a:outputPanel id="noSmokingList">	
											<rich:dataTable value="#{mesasNoFumadores}" var="noSmokingTableList" rows="5" rendered="#{mesasNoFumadores.size>0}" id="listaMesasNoFumadores">
												<f:facet name="header">Mesas para no fumadores</f:facet>
												<rich:column>
													<f:facet name="header"><h:outputText value="Codigo" /></f:facet>
													<h:outputText value="#{noSmokingTableList.codigo}" />
												</rich:column>
												<rich:column>
													<f:facet name="header"><h:outputText value="Capacidad" /></f:facet>
													<h:outputText value="#{noSmokingTableList.capacidad}" />
												</rich:column>
												<rich:column>
													<a:commandButton value="Eliminar" action="#{registerRestaurant.removeTables}" reRender="noSmokingList" />
												</rich:column>
											</rich:dataTable>
											<br/>
											<rich:datascroller rendered="#{mesasNoFumadores.size>0}" for="listaMesasNoFumadores"/>
										</a:outputPanel>
									</div>
									<br/><br/><br/>
								</rich:tab>
								
							
								<rich:tab label="Zona de fumadores" rendered="#{restaurant.permiteFumadores}" labelWidth="380px">
									<br />
									<br />
									<div align="center" >
										<h:panelGrid columns="2">
											<h:graphicImage value="/layout/img/iconoMesa.jpg"/>
											<h:panelGrid columns="2">				
												<h:panelGrid columns="1">
													<h:outputText value="Num. Comensales" />
													<h:outputText value="Codigo"/>
												</h:panelGrid>
												<h:panelGrid columns="1">
													<h:inputText id="comensalesFumadores" value="#{smokingTable.capacidad}" style=" width : 41px;"/> 
													<h:inputText id="codigoFumadores" value="#{smokingTable.codigo}" style=" width : 41px;"/> 
												</h:panelGrid>
											</h:panelGrid> 
										</h:panelGrid>				
										<center>									
											<a:commandButton action="#{registerRestaurant.addSmokingTable}" value="Aadir mesa" reRender="noSmokingList" style=" width : 100px; height : 25px;"/>
										</center>
										<a:outputPanel id="smokingList">	
											<rich:dataTable value="#{mesasFumadores}" var="smokingTableList" rows="5" rendered="#{mesasFumadores.size>0}" id="listaMesasFumadores">
												<f:facet name="header">Mesas para fumadores</f:facet>
												<rich:column>
													<f:facet name="header"><h:outputText value="Num. Mesas" /></f:facet>
													<h:outputText value="#{smokingTableList.codigo}" />
												</rich:column>
												<rich:column>
													<f:facet name="header"><h:outputText value="Capacidad" /></f:facet>
													<h:outputText value="#{smokingTableList.capacidad}" />
												</rich:column>
												<rich:column>
													<a:commandButton value="Eliminar" action="#{registerRestaurant.removeSmokingTables}" reRender="smokingList"/>
												</rich:column>
											</rich:dataTable>
											<br/>
											<rich:datascroller for="listaMesasFumadores" rendered="#{mesasFumadores.size>0}" />
										</a:outputPanel>
									</div>
									
									<br/>
									<br/>
									<br/>
								</rich:tab>
							
							</rich:tabPanel>
						</a:outputPanel>	
						
						<br />
						<br />
						<br />
						
						<a:outputPanel id="panelFotos">
							<a:outputPanel rendered="#{(fotosRestauranteRegistrar.size>0)}" >
								<rich:panel id="panelFotoSeleccionada">
									<f:facet name="header" ><h:outputText value="Fotos del Restaurante"/></f:facet>
									<h:graphicImage url="/RestaurantsImages#{registerRestaurant.fotoSeleccionada}" height="450px;" width="450px;"/>
								</rich:panel>
								<br /> <br />
								<rich:dataGrid value="#{fotosRestauranteRegistrar}" var="foto" columns="#{fotosRestauranteRegistrar.size}" elements="5" width="600px">
						            <rich:panel bodyClass="pbody" style="width: 120px;">
						                <rich:effect type="Opacity" event="onclick" params="duration:0.8,from:0.3,to:1"/>
						                <f:facet name="header" >
						                    <h:outputText value=" "></h:outputText>
						                </f:facet> 
						                <a:commandLink action="#{registerRestaurant.seleccionarFoto(foto.ruta)}" reRender="panelFotos" id="enlaceFoto">
						                    <h:graphicImage url="/RestaurantsImages#{foto.ruta}" height="90px;" width="90px;"/>
						                </a:commandLink>
										<br/>
						                <a:commandLink action="#{registerRestaurant.deletePicture}" reRender="panelFotos" id="enlaceEliminarFoto">
						                    <h:graphicImage url="/layout/img/button_delete.gif" />
						                </a:commandLink>
						               
						            </rich:panel>
						            
						        </rich:dataGrid >
							</a:outputPanel>
						</a:outputPanel>	
						
				<h:outputText value="Fotos - Max 5" />
				<rich:fileUpload maxFilesQuantity="5" uploadData="#{registerRestaurant.fileList}" acceptedTypes="jpeg, jpg, gif, png"
					disabled="#{fotosRestauranteRegistrar.size >= registerRestaurant.maxFiles}"  
					fileUploadListener="#{registerRestaurant.uploadFiles}">
					<f:facet name="header">Fotos - Max 5</f:facet>
					
					<a:support event="onuploadcomplete" reRender="panelFotos"/>
					
				</rich:fileUpload>
			
					<br />
					<br />
					<br />
					
					<div align="center" style="margin-top: 13px;">
						<h:commandButton id="bRegister" value="#{messages.registerButton}" styleClass="btn100" action="#{registerRestaurant.register}" style="height : 35px; width : 150px;"></h:commandButton>
						<rich:spacer width="20px;"/>
						<h:commandButton id="bRegCancel" value="#{messages.cancel}" styleClass="btn100"	action="#{registerRestaurant.cancel}" style=" width : 150px; height : 35px;"></h:commandButton>
					</div>
						
				</div>
					
				</rich:panel>			
				
			</div>
			</h:form>
			
			
		</f:view>
	</ui:define>
</ui:composition>